<template>
	<section>
		<!--工具条-->

		<el-row class="toolbar" style="padding-bottom: 0px;" type="flex" >
			<el-col :span="6">
          <el-radio-group v-model="queryForm.course" size="small" style="margin-top:4px" >
            <el-radio-button v-for="(course,idx) in exampaper" :label="course.text" :key="idx"></el-radio-button>
          </el-radio-group>
			</el-col>
			<el-col :span="18"  style="float:right">
				<el-form :inline="true" style="float:right">
					<el-form-item >
						<el-input v-model="queryForm.name" style="width:140px;" placeholder="请输入老师姓名">
						</el-input>
					</el-form-item>
					<el-form-item >
						<el-select v-model="queryForm.studios" style="width:140px;" placeholder="选择省份">
							<el-option v-for="province in provices"
                    :key="province.province"
                    :value="province.province"
                    :label="province.province">
         		 </el-option>
						</el-select>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" v-on:click="getUsers">查询</el-button>
					</el-form-item>
          	<el-form-item>
						<el-button type="primary" v-on:click="assignTeacher">分配阅卷老师</el-button>
					</el-form-item>
				</el-form>
			</el-col>
		</el-row>
		
		<!--列表-->
		<el-table  :data="users" highlight-current-row v-loading="listLoading" @selection-change="selsChange" border style="width: 100%;">
			<!-- <el-table-column type="selection" width="55"></el-table-column> -->
			<el-table-column prop="id" label="编号" width="150"  header-align='center' align='center'>
			</el-table-column>
			<el-table-column prop="studioname" label="生源省份" header-align='center'  align='center'>
			</el-table-column>
			<el-table-column prop="province" label="阅卷人"  header-align='center'  align='center'>
			</el-table-column>
						<el-table-column prop="studentsCount" label="数量"  header-align='center'  align='center'>
			</el-table-column>
			<el-table-column label="操作" width="150" header-align='center'  align='center'>
				<template scope="scope">
					<el-button type="text" size="small" @click="handleQuery(scope.$index, scope.row)">查看</el-button>
				</template>
			</el-table-column>
		</el-table>

		<!--工具条-->
		<el-col :span="24" class="toolbar">
			<!-- <el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button> -->
			<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" center >
			</el-pagination>
		</el-col>

		<!--编辑界面-->
		<el-dialog title="分配阅卷老师" :visible.sync="assginTeacherVisible" :close-on-click-modal="false" width="300px" custom-class="rectround" >
			<examAssignTeacher></examAssignTeacher>
		</el-dialog>

	</section>
</template>

<script>
	import provinceCodeList from "../../utils/provinceCode";
	import util from '../../common/js/util'
	 import {basicRequest} from "../../utils/request";
	import {getStudioListPage } from '../../api/api';

	import examAssignTeacher from './examAssignTeacher'
	export default {
		components:{examAssignTeacher},
		data() {
			return {
				provices:provinceCodeList,
        exampaper:[],
				queryForm: {
					current:1,
					size:10,
					course:'',
					name: '',
					province:''
        },
				users: [],
				total: 0,
				page: 1,
				listLoading: false,
				sels: [],//列表选中列
				assginTeacherVisible: false,//编辑界面是否显示
			}
		},
		methods: {
      assignTeacher(){
        this.assginTeacherVisible=true
      },
			handleCurrentChange(val) {
				this.page = val;
				this.getUsers();
			},
			//获取用户列表
			getUsers() {
				this.listLoading = true;
				basicRequest({method:'post',
										url: '/allocation/page',
										data:this.queryForm
                }).then(data => {
										this.listLoading = false;
                    console.log(data)
                    this.unmarkedCount = data.count
                    this.markedCount = data.dealCount
                    this.total = data.total
                    this.levelStatisticsList = data.stats
                })
			
				// getStudioListPage(this.queryForm).then((res) => {
				// 	this.total = res.data.total;
				// 	this.users = res.data.users;
				// 	this.listLoading = false;
				// });
			},
			//删除
			handleQuery: function (index, row) {
				this.$store.state.studio.name=row.studioname
				this.$store.state.studio.studentsCount=row.studentsCount
				this.$router.push({path: '/examPaperAssignDetail'})
			
			},
			//显示编辑界面
			handleEdit: function (index, row) {
				this.editFormVisible = true;
				this.editForm = Object.assign({}, row);
			},
	
			
			selsChange: function (sels) {
				this.sels = sels;
			},

		},
		mounted() {
      this.exampaper=this.$store.state.exampaper
      this.queryForm.course=this.exampaper[0].text
			this.getUsers();
		}
	}

</script>

<style>
.rectround {
  border-radius: 10px;
}
.el-button--small{
	padding: 1px 1px;
}
.el-dialog__header{
	text-align: center;
}
.el-dialog__title{
	font-size: 32px;
}
</style>